<!DOCTYPE html>
<html lang="en">
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
		<meta http-equiv="X-UA-Compatible" content="ie=edge" />
		<meta name="author" content="xiaojiangK" />
		<meta name="email" content="740092856@qq.com" />
		<meta name="gitee" content="https://gitee.com/xiaojiangk/" />
		<meta name="viewport" content="width=1200, initial-scale=1.0" />
		<link rel="stylesheet" type="text/css" href="images/css/admin.min.css" />
		<link rel="shortcut icon" href="images/logo.png" type="image/x-icon" />
		<title>admin-icon</title>
	</head>
	<body>
		<div class="demo-main icon">
			<div class="admim-title">
				<h2>Icon 图标</h2>
				<p>提供了一套常用的图标集合。</p>
			</div>
			<div class="item">
				<div class="title">
					<h3>使用方法</h3>
					<p>直接通过设置类名为 iconfont icon-* 来使用即可。例如：</p>
				</div>
				<div class="content method">
					<i class="iconfont icon-edits"></i>
					<i class="iconfont icon-share"></i>
					<i class="iconfont icon-remove"></i>
					<qx-button type="primary" icon="icon-seekicon">搜索</qx-button>
					<qx-button type="primary" icon="icon-remove">关闭父元素Layer</qx-button>
				</div>
			</div>
			<div class="item">
				<div class="title">
					<h3>图标集合</h3>
				</div>
				<div class="content group">
					<ul>
						<li>
							<i class="iconfont icon-info"></i>
							<span>icon-info</span>
						</li>
						<li>
							<i class="iconfont icon-infos"></i>
							<span>icon-infos</span>
						</li>
						<li>
							<i class="iconfont icon-success"></i>
							<span>icon-success</span>
						</li>
						<li>
							<i class="iconfont icon-successs"></i>
							<span>icon-successs</span>
						</li>
						<li>
							<i class="iconfont icon-hook"></i>
							<span>icon-hook</span>
						</li>
						<li>
							<i class="iconfont icon-error"></i>
							<span>icon-error</span>
						</li>
						<li>
							<i class="iconfont icon-hollow-close"></i>
							<span>icon-hollow-close</span>
						</li>
						<li>
							<i class="iconfont icon-warning"></i>
							<span>icon-warning</span>
						</li>
						<li>
							<i class="iconfont icon-warnings"></i>
							<span>icon-warnings</span>
						</li>
						<li>
							<i class="iconfont icon-fileopen"></i>
							<span>icon-fileopen</span>
						</li>
						<li>
							<i class="iconfont icon-retract"></i>
							<span>icon-retract</span>
						</li>
						<li>
							<i class="iconfont icon-see"></i>
							<span>icon-see</span>
						</li>
						<li>
							<i class="iconfont icon-sees"></i>
							<span>icon-sees</span>
						</li>
						<li>
							<i class="iconfont icon-max"></i>
							<span>icon-max</span>
						</li>
						<li>
							<i class="iconfont icon-refresh"></i>
							<span>icon-refresh</span>
						</li>
						<li>
							<i class="iconfont icon-ref-left"></i>
							<span>icon-ref-left</span>
						</li>
						<li>
							<i class="iconfont icon-ref-right"></i>
							<span>icon-ref-right</span>
						</li>
						<li>
							<i class="iconfont icon-arrowright"></i>
							<span>icon-arrowright</span>
						</li>
						<li>
							<i class="iconfont icon-arrowleft"></i>
							<span>icon-arrowleft</span>
						</li>
						<li>
							<i class="iconfont icon-arrowdown"></i>
							<span>icon-arrowdown</span>
						</li>
						<li>
							<i class="iconfont icon-arrowup"></i>
							<span>icon-arrowup</span>
						</li>
						<li>
							<i class="iconfont icon-left-round"></i>
							<span>icon-left-round</span>
						</li>
						<li>
							<i class="iconfont icon-right-round"></i>
							<span>icon-right-round</span>
						</li>
						<li>
							<i class="iconfont icon-magnifier"></i>
							<span>icon-magnifier</span>
						</li>
						<li>
							<i class="iconfont icon-uploadpic"></i>
							<span>icon-uploadpic</span>
						</li>
						<li>
							<i class="iconfont icon-others"></i>
							<span>icon-others</span>
						</li>
						<li>
							<i class="iconfont icon-notice"></i>
							<span>icon-notice</span>
						</li>
						<li>
							<i class="iconfont icon-adjust"></i>
							<span>icon-adjust</span>
						</li>
						<li>
							<i class="iconfont icon-data"></i>
							<span>icon-data</span>
						</li>
						<li>
							<i class="iconfont icon-form"></i>
							<span>icon-form</span>
						</li>
						<li>
							<i class="iconfont icon-navigation"></i>
							<span>icon-navigation</span>
						</li>
						<li>
							<i class="iconfont icon-share"></i>
							<span>icon-share</span>
						</li>
						<li>
							<i class="iconfont icon-shares"></i>
							<span>icon-shares</span>
						</li>
						<li>
							<i class="iconfont icon-loading"></i>
							<span>icon-loading</span>
						</li>
						<li>
							<i class="iconfont icon-spinner"></i>
							<span>icon-spinner</span>
						</li>
						<li>
							<i class="iconfont icon-uploads"></i>
							<span>icon-uploads</span>
						</li>
						<li>
							<i class="iconfont icon-upload"></i>
							<span>icon-upload</span>
						</li>
						<li>
							<i class="iconfont icon-forks"></i>
							<span>icon-forks</span>
						</li>
						<li>
							<i class="iconfont icon-close"></i>
							<span>icon-close</span>
						</li>
						<li>
							<i class="iconfont icon-closes"></i>
							<span>icon-closes</span>
						</li>
						<li>
							<i class="iconfont icon-seekicon"></i>
							<span>icon-seekicon</span>
						</li>
						<li>
							<i class="iconfont icon-searchs"></i>
							<span>icon-searchs</span>
						</li>
						<li>
							<i class="iconfont icon-payconfig"></i>
							<span>icon-payconfig</span>
						</li>
						<li>
							<i class="iconfont icon-coin"></i>
							<span>icon-coin</span>
						</li>
						<li>
							<i class="iconfont icon-export"></i>
							<span>icon-export</span>
						</li>
						<li>
							<i class="iconfont icon-daochu"></i>
							<span>icon-daochu</span>
						</li>
						<li>
							<i class="iconfont icon-weChat"></i>
							<span>icon-weChat</span>
						</li>
						<li>
							<i class="iconfont icon-alipay"></i>
							<span>icon-alipay</span>
						</li>
						<li>
							<i class="iconfont icon-icondown"></i>
							<span>icon-icondown</span>
						</li>
						<li>
							<i class="iconfont icon-iconup"></i>
							<span>icon-iconup</span>
						</li>
						<li>
							<i class="iconfont icon-users"></i>
							<span>icon-users</span>
						</li>
						<li>
							<i class="iconfont icon-user"></i>
							<span>icon-user</span>
						</li>
						<li>
							<i class="iconfont icon-resets"></i>
							<span>icon-resets</span>
						</li>
						<li>
							<i class="iconfont icon-reset"></i>
							<span>icon-reset</span>
						</li>
						<li>
							<i class="iconfont icon-edits"></i>
							<span>icon-edits</span>
						</li>
						<li>
							<i class="iconfont icon-edit"></i>
							<span>icon-edit</span>
						</li>
						<li>
							<i class="iconfont icon-password"></i>
							<span>icon-password</span>
						</li>
						<li>
							<i class="iconfont icon-passwd"></i>
							<span>icon-passwd</span>
						</li>
						<li>
							<i class="iconfont icon-remove"></i>
							<span>icon-remove</span>
						</li>
						<li>
							<i class="iconfont icon-delete"></i>
							<span>icon-delete</span>
						</li>
						<li>
							<i class="iconfont icon-adds"></i>
							<span>icon-adds</span>
						</li>
						<li>
							<i class="iconfont icon-add"></i>
							<span>icon-add</span>
						</li>
						<li>
							<i class="iconfont icon-menu"></i>
							<span>icon-menu</span>
						</li>
						<li>
							<i class="iconfont icon-menuopen"></i>
							<span>icon-menuopen</span>
						</li>
						<li>
							<i class="iconfont icon-finance"></i>
							<span>icon-finance</span>
						</li>
						<li>
							<i class="iconfont icon-wallet"></i>
							<span>icon-wallet</span>
						</li>
						<li>
							<i class="iconfont icon-custom"></i>
							<span>icon-custom</span>
						</li>
						<li>
							<i class="iconfont icon-customs"></i>
							<span>icon-customs</span>
						</li>
						<li>
							<i class="iconfont icon-fork"></i>
							<span>icon-fork</span>
						</li>
						<li>
							<i class="iconfont icon-fork-spoon"></i>
							<span>icon-fork-spoon</span>
						</li>
						<li>
							<i class="iconfont icon-square-full"></i>
							<span>icon-square-full</span>
						</li>
						<li>
							<i class="iconfont icon-goblet-full"></i>
							<span>icon-goblet-full</span>
						</li>
						<li>
							<i class="iconfont icon-cream-square"></i>
							<span>icon-cream-square</span>
						</li>
						<li>
							<i class="iconfont icon-goblet"></i>
							<span>icon-goblet</span>
						</li>
						<li>
							<i class="iconfont icon-cup"></i>
							<span>icon-cup</span>
						</li>
						<li>
							<i class="iconfont icon-hot-water"></i>
							<span>icon-hot-water</span>
						</li>
						<li>
							<i class="iconfont icon-cream-round"></i>
							<span>icon-cream-round</span>
						</li>
						<li>
							<i class="iconfont icon-potato-strips"></i>
							<span>icon-potato-strips</span>
						</li>
						<li>
							<i class="iconfont icon-cold-drink"></i>
							<span>icon-cold-drink</span>
						</li>
						<li>
							<i class="iconfont icon-cloudy-sunny"></i>
							<span>icon-cloudy-sunny</span>
						</li>
						<li>
							<i class="iconfont icon-aid-kit"></i>
							<span>icon-aid-kit</span>
						</li>
						<li>
							<i class="iconfont icon-off-microphone"></i>
							<span>icon-off-microphone</span>
						</li>
						<li>
							<i class="iconfont icon-chat-round"></i>
							<span>icon-chat-round</span>
						</li>
						<li>
							<i class="iconfont icon-chatline-round"></i>
							<span>icon-chatline-round</span>
						</li>
						<li>
							<i class="iconfont icon-chatdot-round"></i>
							<span>icon-chatdot-round</span>
						</li>
						<li>
							<i class="iconfont icon-chatdot-square"></i>
							<span>icon-chatdot-square</span>
						</li>
						<li>
							<i class="iconfont icon-takeaway-box"></i>
							<span>icon-takeaway-box</span>
						</li>
						<li>
							<i class="iconfont icon-docs"></i>
							<span>icon-docs</span>
						</li>
						<li>
							<i class="iconfont icon-cilun"></i>
							<span>icon-cilun</span>
						</li>
						<li>
							<i class="iconfont icon-eb"></i>
							<span>icon-eb</span>
						</li>
						<li>
							<i class="iconfont icon-thunder"></i>
							<span>icon-thunder</span>
						</li>
						<li>
							<i class="iconfont icon-switchbtn"></i>
							<span>icon-switchbtn</span>
						</li>
						<li>
							<i class="iconfont icon-coffee"></i>
							<span>icon-coffee</span>
						</li>
						<li>
							<i class="iconfont icon-home-normal"></i>
							<span>icon-home-normal</span>
						</li>
						<li>
							<i class="iconfont icon-home"></i>
							<span>icon-home</span>
						</li>
						<li>
							<i class="iconfont icon-cream"></i>
							<span>icon-cream</span>
						</li>
						<li>
							<i class="iconfont icon-tickets"></i>
							<span>icon-tickets</span>
						</li>
						<li>
							<i class="iconfont icon-web"></i>
							<span>icon-web</span>
						</li>
						<li>
							<i class="iconfont icon-headset"></i>
							<span>icon-headset</span>
						</li>
						<li>
							<i class="iconfont icon-chilun"></i>
							<span>icon-chilun</span>
						</li>
						<li>
							<i class="iconfont icon-hollowbuy"></i>
							<span>icon-hollowbuy</span>
						</li>
						<li>
							<i class="iconfont icon-buy"></i>
							<span>icon-buy</span>
						</li>
						<li>
							<i class="iconfont icon-cooperate"></i>
							<span>icon-cooperate</span>
						</li>
						<li>
							<i class="iconfont icon-plus"></i>
							<span>icon-plus</span>
						</li>
						<li>
							<i class="iconfont icon-aircraft"></i>
							<span>icon-aircraft</span>
						</li>
						<li>
							<i class="iconfont icon-fullmore"></i>
							<span>icon-fullmore</span>
						</li>
						<li>
							<i class="iconfont icon-more"></i>
							<span>icon-more</span>
						</li>
						<li>
							<i class="iconfont icon-help"></i>
							<span>icon-help</span>
						</li>
						<li>
							<i class="iconfont icon-outlinehelp"></i>
							<span>icon-outlinehelp</span>
						</li>
						<li>
							<i class="iconfont icon-female"></i>
							<span>icon-female</span>
						</li>
						<li>
							<i class="iconfont icon-male"></i>
							<span>icon-male</span>
						</li>
						<li>
							<i class="iconfont icon-play"></i>
							<span>icon-play</span>
						</li>
						<li>
							<i class="iconfont icon-platform"></i>
							<span>icon-platform</span>
						</li>
						<li>
							<i class="iconfont icon-outlinereduce"></i>
							<span>icon-outlinereduce</span>
						</li>
						<li>
							<i class="iconfont icon-qrcode"></i>
							<span>icon-qrcode</span>
						</li>
						<li>
							<i class="iconfont icon-picture"></i>
							<span>icon-picture</span>
						</li>
						<li>
							<i class="iconfont icon-mingfood"></i>
							<span>icon-mingfood</span>
						</li>
						<li>
							<i class="iconfont icon-message"></i>
							<span>icon-message</span>
						</li>
						<li>
							<i class="iconfont icon-refrigerator"></i>
							<span>icon-refrigerator</span>
						</li>
						<li>
							<i class="iconfont icon-alarmclock"></i>
							<span>icon-alarmclock</span>
						</li>
						<li>
							<i class="iconfont icon-alarmclocks"></i>
							<span>icon-alarmclocks</span>
						</li>
						<li>
							<i class="iconfont icon-mouse"></i>
							<span>icon-mouse</span>
						</li>
						<li>
							<i class="iconfont icon-goods"></i>
							<span>icon-goods</span>
						</li>
						<li>
							<i class="iconfont icon-dish"></i>
							<span>icon-dish</span>
						</li>
						<li>
							<i class="iconfont icon-doc"></i>
							<span>icon-doc</span>
						</li>
						<li>
							<i class="iconfont icon-bicycle"></i>
							<span>icon-bicycle</span>
						</li>
						<li>
							<i class="iconfont icon-scan"></i>
							<span>icon-scan</span>
						</li>
						<li>
							<i class="iconfont icon-printing"></i>
							<span>icon-printing</span>
						</li>
						<li>
							<i class="iconfont icon-tools"></i>
							<span>icon-tools</span>
						</li>
						<li>
							<i class="iconfont icon-toolss"></i>
							<span>icon-toolss</span>
						</li>
						<li>
							<i class="iconfont icon-toolsbox"></i>
							<span>icon-toolsbox</span>
						</li>
						<li>
							<i class="iconfont icon-toolsboxs"></i>
							<span>icon-toolsboxs</span>
						</li>
						<li>
							<i class="iconfont icon-clip"></i>
							<span>icon-clip</span>
						</li>
						<li>
							<i class="iconfont icon-place"></i>
							<span>icon-place</span>
						</li>
						<li>
							<i class="iconfont icon-places"></i>
							<span>icon-places</span>
						</li>
						<li>
							<i class="iconfont icon-cloudy"></i>
							<span>icon-cloudy</span>
						</li>
						<li>
							<i class="iconfont icon-messages"></i>
							<span>icon-messages</span>
						</li>
						<li>
							<i class="iconfont icon-mobile"></i>
							<span>icon-mobile</span>
						</li>
						<li>
							<i class="iconfont icon-mobiles"></i>
							<span>icon-mobiles</span>
						</li>
						<li>
							<i class="iconfont icon-link"></i>
							<span>icon-link</span>
						</li>
						<li>
							<i class="iconfont icon-trophy"></i>
							<span>icon-trophy</span>
						</li>
						<li>
							<i class="iconfont icon-sunny"></i>
							<span>icon-sunny</span>
						</li>
						<li>
							<i class="iconfont icon-shangji"></i>
							<span>icon-shangji</span>
						</li>
						<li>
							<i class="iconfont icon-truck"></i>
							<span>icon-truck</span>
						</li>
						<li>
							<i class="iconfont icon-trophystar"></i>
							<span>icon-trophystar</span>
						</li>
						<li>
							<i class="iconfont icon-clasphands"></i>
							<span>icon-clasphands</span>
						</li>
						<li>
							<i class="iconfont icon-lollipop"></i>
							<span>icon-lollipop</span>
						</li>
						<li>
							<i class="iconfont icon-watch"></i>
							<span>icon-watch</span>
						</li>
						<li>
							<i class="iconfont icon-watchs"></i>
							<span>icon-watchs</span>
						</li>
						<li>
							<i class="iconfont icon-plane"></i>
							<span>icon-plane</span>
						</li>
						<li>
							<i class="iconfont icon-pause"></i>
							<span>icon-pause</span>
						</li>
						<li>
							<i class="iconfont icon-pictures"></i>
							<span>icon-pictures</span>
						</li>
						<li>
							<i class="iconfont icon-camera"></i>
							<span>icon-camera</span>
						</li>
						<li>
							<i class="iconfont icon-scissors"></i>
							<span>icon-scissors</span>
						</li>
						<li>
							<i class="iconfont icon-doubleright"></i>
							<span>icon-doubleright</span>
						</li>
						<li>
							<i class="iconfont icon-doubleleft"></i>
							<span>icon-doubleleft</span>
						</li>
						<li>
							<i class="iconfont icon-minus"></i>
							<span>icon-minus</span>
						</li>
						<li>
							<i class="iconfont icon-cameras"></i>
							<span>icon-cameras</span>
						</li>
						<li>
							<i class="iconfont icon-phone"></i>
							<span>icon-phone</span>
						</li>
						<li>
							<i class="iconfont icon-phonecall"></i>
							<span>icon-phonecall</span>
						</li>
						<li>
							<i class="iconfont icon-goodss"></i>
							<span>icon-goodss</span>
						</li>
						<li>
							<i class="iconfont icon-car"></i>
							<span>icon-car</span>
						</li>
						<li>
							<i class="iconfont icon-stars"></i>
							<span>icon-stars</span>
						</li>
						<li>
							<i class="iconfont icon-star"></i>
							<span>icon-star</span>
						</li>
						<li>
							<i class="iconfont icon-videos"></i>
							<span>icon-videos</span>
						</li>
						<li>
							<i class="iconfont icon-video"></i>
							<span>icon-video</span>
						</li>
						<li>
							<i class="iconfont icon-voice"></i>
							<span>icon-voice</span>
						</li>
						<li>
							<i class="iconfont icon-check"></i>
							<span>icon-check</span>
						</li>
						<li>
							<i class="iconfont icon-umbrella"></i>
							<span>icon-umbrella</span>
						</li>
					</ul>
				</div>
			</div>
		</div>

		<script src="images/js/jquery.min.js"></script>
		<script src="images/js/admin.min.js"></script>
		<script>
			// 删除父元素中layer弹层
			$('.method button')
				.eq(1)
				.on('click', function () {
					$(this).closeLayer({
						refresh: true
					})
				})
		</script>
	</body>
</html>
